import React from 'react'
import { useNavigate } from 'react-router-dom';
import { NavBar} from "antd-mobile";
import style from '../../css/setting/SecurityCenter.module.css';
import { List, Switch } from 'antd-mobile';
export default function SecurityCenter() {
    const navigate = useNavigate()
    const back = () => {
        navigate(-1);
      };
      function protection() {
        navigate('/my/setting/securityCenter/Protection')
      }
      function management() {
        navigate('/my/setting/securityCenter/DeviceManager')
      }
      function protect() {
        navigate('/my/setting/securityCenter/AccountLockout')
      }
      function gotOutOfLine() {
        navigate('/my/setting/securityCenter/GotOutOfLine')
      }
  return (
    <>
        <NavBar onBack={back}>安全中心</NavBar>
        <List mode='card'>
     <List.Item onClick={protection}>我的保护</List.Item>  
     <List.Item onClick={management}>设备管理</List.Item>  
     <List.Item onClick={protect}>账号紧急保护</List.Item>  
     <List.Item onClick={gotOutOfLine}>违规记录</List.Item>  
     </List>
    </>
  )
}
